<template>
	<view class='popShopTel1 popShop' :class="isShowInfo==1?'a':''">
		<view class="top flex_row_btw_top">
			<view class="left flex_row_start_center">
			</view>
			<view class="close">
				<up-icon name="close" color="#000" size="16" @tap="closes"></up-icon>
			</view>
		</view>
		<view class="main" >
			<view class="tip" v-if="isShowInfo==0">
				确定{{type=='close'?'取消此订单':'收货'}}吗
			</view>
			<view class="tip" v-if="isShowInfo==1">
				当前订单已享受平台补贴优惠，若取消订单则新订单无平台补贴！
			</view>
			<view class="bottom flex_row_btw_center">
				<view class="btn" @click="closes">
					取消
				</view>
				<view class="btn1" @click="saveInfo">
					确定
				</view>
			</view>

		</view>
	</view>

</template>

<script setup>
	import {
		closeOrderApi,
		collectOrder
	} from '@/api/mineOrder.js'
	import {
		ref,
		onMounted,
		defineExpose,
		watch,
		reactive,
		defineEmits
	} from 'vue';
	import {
		onLoad,
		onReady,
		onShow,
		onHide,
		
	} from '@dcloudio/uni-app'

	const orderId = ref('')
	const type= ref('')
	const isShowInfo = ref(0)
	const emit = defineEmits(['closeModel', 'saveModel'])
	const saveInfo = async () => {
		let res
		if(type.value == 'close'){
			res = await closeOrderApi({
				id: orderId.value
			})
		}else{
			res = await collectOrder({
				id: orderId.value
			})
		}
		uni.showToast({
			icon: 'none',
			title: res.msg
		})
		emit('saveModel')
	}
	//取消
	const closes = () => {
		emit('closeModel')
	}
	defineExpose({
		orderId,
		type,
		isShowInfo
	})
</script>

<style scoped lang="less">
	.a{
		height: 340rpx !important;
	}
	.popShopTel1 {
		width: 588rpx;
		// background-image: url(https://zzt-pub.oss-cn-wuhan-lr.aliyuncs.com/clientImg/telBj%402x.png);
		background-repeat: no-repeat;
		background-size: 100%;
        height: 300rpx;
		.top {
			padding-top: 30rpx;
			padding-right: 30rpx;
		}

		.main {
			margin-top: 20rpx;

			.tip {
				font-weight: 500;
				font-size: 32rpx;
				color: #333333;
				text-align: center;
				margin-bottom: 76rpx;
				width: 80%;
				    /* margin: 0 auto; */
				    display: flex;
				    justify-content: center;
				    align-items: center;
				    flex-direction: column;
				    margin-left: 10%;
			}
		}

		.bottom {
			width: calc(100% - 53px);
			margin: 0 auto;

			.btn1 {
				display: inline-block;
				width: 230rpx;
				height: 80rpx;
				background: linear-gradient(113deg, #F2BD6F 0%, #CCA05F 100%);
				border-radius: 20rpx;
				font-family: Source Han Sans CN, Source Han Sans CN;
				font-weight: 500;
				font-size: 32rpx;
				color: #FFFFFF;
				line-height: 80rpx;
				text-align: center;
				font-style: normal;
				text-transform: none;
			}

			.btn {
				display: inline-block;
				width: 230rpx;
				height: 80rpx;
				background: #f0f0f0;
				border-radius: 20rpx;
				font-family: Source Han Sans CN, Source Han Sans CN;
				font-weight: 500;
				font-size: 30rpx;
				color: #333;
				line-height: 80rpx;
				text-align: center;
				font-style: normal;
				text-transform: none;
			}
		}

	}
</style>